<%@page pageEncoding="UTF-8" isELIgnored="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@taglib prefix="f" uri="http://susano.googlecode.com/functions"%>


<jsp:include page="../common/header.jsp"/>

<script type="text/javascript">
$(function(){
	$("#input_emp").accordion({ active: ${activeAccordionNo}, collapsible: true, header: "h3" });
});

var targetViewEmp;

/*
 * Ajax通信成功時の処理
 */
var handleSuccess = function(data, dataType) {
	targetViewEmp.text("");
	$.each(data, function(i, item){
		targetViewEmp.append("氏名:" + item.name + " (" + item.age + "歳)" + "<br>\n");
	});
}

/*
 * Ajax通信失敗時の処理
 */
var handleError = function(XMLHttpRequest, textStatus, errorThrown){
	//alert("エラー");
}

/*
 * Ajax通信終了時の処理
 */
var handleComplete = function(XMLHttpRequest, textStatus) {
	//alert("終了");
}


function getEmp(parent, target) {
	targetViewEmp = target;
	// Ajax通信
	$.ajax({
		url: "/company/ListEmployeeAjax",
		type: "post",
		data: "parent=" + parent,
		dataType: "json",
		success: handleSuccess,
		error: handleError,
		complete: handleComplete
	});
}
</script>


<div id="input_emp" style="width:400px;">
	<div>
		<h3><a href="#">会社登録</a></h3>
		<form method="post" action="${f:url('add')}">
		社名:&nbsp;
		<input type="text" ${f:text("companyName")} class="${f:errorClass('companyName', 'error')}"><br />
		<input type="submit" value="登録"></input>
		</form>
	</div>
	<div>
		<h3><a href="#">従業員登録</a></h3>
		<form method="post" action="${f:url('addEmployee')}">
		社名:&nbsp;
		<select name="parent">
		<option value="">選択してください。</option>
		<c:forEach items="${companies}" var="v" varStatus="s">
		<option ${f:select("parent", v['__key__'])}>${v['name']} (${v['date']})</option>
		</c:forEach>
		</select><br />
		氏名:&nbsp;
		<input type="text" ${f:text("name")} class="${f:errorClass('name', 'error')}"><br />
		年齢:&nbsp;
		<input type="text" ${f:text("age")} class="${f:errorClass('age', 'error')}"><br />
		<input type="submit" value="登録"></input>
		</form>
	</div>
</div>

<div>
	<form method="post" action="${f:url('download')}">
	<select name="type">
	<option value="text">text</option>
	<option value="image">image</option>
	</select>
	<input type="submit" value="ファイルダウンロード"></input>
	</form>
</div>

<div>
	<h3>会社一覧</h3>
	<table border="1">
	<tr>
	<th>設立日</th>
	<th>社名</th>
	<th>登録ユーザ</th>
	<th>従業員</th>
	</tr>
	<c:forEach items="${companies}" var="v" varStatus="s">
	<tr>
	<td>${v['date']}</td>
	<td>${v['name']}</td>
	<td>${v['userId']}</td>
	<td>
		<div>
			<script type="text/javascript">
			$(function(){
				$('#getEmp${s.index}').click(function(){
					getEmp("${v['__key__']}", $("#viewEmp${s.index}"));
				});
			});
			</script>
			<button id="getEmp${s.index}">従業員表示</button>
			<div id="viewEmp${s.index}"></div>
		<div>
	</td>
	</tr>
	</c:forEach>
	</table>
</div>

<jsp:include page="../common/footer.jsp" />
